<!doctype html>
<html class="no-js" lang="en" dir="ltr">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>mat-Add </title>

    <!-- project css file  -->
    <link rel="stylesheet" href="static/css/ihealth.style.min.css">
</head>
<body>

<div id="ihealth-layout" class="theme-tradewind">




<!--    左边栏-->
    <!-- sidebar -->
    <div class="sidebar px-4 py-4 py-md-5 me-0">
        <div class="d-flex flex-column h-100">
            <a href="index.html" class="mb-0 brand-icon">
                <span class="logo-icon">
                    <i class="icofont-heart-beat fs-2"></i>
                </span>
                <span class="logo-text">溯源系统</span>
            </a>
            <!-- Menu: main ul -->

            <ul class="menu-list flex-grow-1 mt-3">
                <li class="collapsed">
                    <a class="m-link" data-bs-toggle="collapse" data-bs-target="#dashboard" href="#">
                        <i class="icofont-page fs-5"></i> <span>查询</span> <span
                            class="arrow icofont-rounded-down ms-auto text-end fs-5"></span></a>
                    <!-- Menu: Sub menu ul -->
                    <ul class="sub-menu collapse" id="dashboard">
                        <li><a class="ms-link" href="get-mat-chain.html">查询链上信息</a></li>
                        <li><a class="ms-link" href="get-mat-ipfs.html"> 查询基本信息</a></li>
                        <li><a class="ms-link" href="get-mat-encrypt.html"> 查询保密信息</a></li>
                    </ul>
                </li>
                <li><a class="m-link" href="mat-add.html"><i class="icofont-blood-test fs-5"></i> <span>添加原料信息</span></a>
                <li><a class="m-link" href="*"><i class="icofont-ui-video-chat fs-5"></i> <span>消息</span></a>
                </li>

                <li class="collapsed">
                    <a class="m-link" data-bs-toggle="collapse" data-bs-target="#menu-Doctor" href="#">
                        <i class="icofont-doctor-alt fs-5"></i> <span>成员管理</span> <span
                            class="arrow icofont-rounded-down ms-auto text-end fs-5"></span></a>
                    <!-- Menu: Sub menu ul -->
                    <ul class="sub-menu collapse" id="menu-Doctor">
                        <li><a class="ms-link" href="*">添加管理员</a></li>
                        <li><a class="ms-link" href="*">删除管理员</a></li>
                        <li><a class="ms-link" href="*">值班表</a></li>
                    </ul>
                </li>



                <li><a class="m-link" href="*">
                    <i class="icofont-stretcher fs-5"></i>
                    <span>产品召回</span></a></li>


                <li><a class="m-link" href="department.html"><i class="icofont-hospital fs-5"></i>
                    <span>部门管理</span></a></li>
                <li class="collapsed">
                    <a class="m-link" data-bs-toggle="collapse" data-bs-target="#menu-Componentsone" href="#"><i
                            class="icofont-ui-calculator"></i> <span>账单管理</span> <span
                            class="arrow icofont-rounded-down ms-auto text-end fs-5"></span></a>
                    <!-- Menu: Sub menu ul -->
                    <ul class="sub-menu collapse" id="menu-Componentsone">
                        <li><a class="ms-link" href="*"><span>发票</span> </a></li>
                        <li><a class="ms-link" href="*"><span>付款</span> </a></li>
                        <li><a class="ms-link" href="*"><span>花费</span> </a></li>
                    </ul>
                </li>

                <li class="collapsed">
                    <a class="m-link" data-bs-toggle="collapse" data-bs-target="#app" href="#">
                        <i class="icofont-code-alt fs-5"></i> <span>App</span> <span
                            class="arrow icofont-rounded-down ms-auto text-end fs-5"></span></a>
                    <!-- Menu: Sub menu ul -->
                    <ul class="sub-menu collapse" id="app">
                        <li><a class="ms-link" href="calendar.html">日历</a></li>
                        <li><a class="ms-link" href="chat.html"> 聊天</a></li>
                    </ul>
                </li>


            </ul>

            <!-- Menu: menu collepce btn -->
            <button type="button" class="btn btn-link sidebar-mini-btn text-light">
                <span class="ms-2"><i class="icofont-bubble-right"></i></span>
            </button>
        </div>
    </div>






    <!-- main body area -->
    <div class="main px-lg-4 px-md-4">

        <!-- Body: Header -->


<!--        头像-->
        <div class="header">
            <nav class="navbar py-4">
                <div class="container-xxl">

                    <!-- header rightbar icon -->
                    <div class="h-right d-flex align-items-center mr-5 mr-lg-0 order-1">
                        <div class="d-flex">
                            <a class="nav-link text-primary collapsed" href="javascript:;" title="Get Help">
                                <i class="icofont-info-square fs-5"></i>
                            </a>
                        </div>
                        <div class="dropdown notifications zindex-popover">
                            <a class="nav-link dropdown-toggle pulse" href="#" role="button" data-bs-toggle="dropdown">
                                <i class="icofont-alarm fs-5"></i>
                                <span class="pulse-ring"></span>
                            </a>

<!--                            <div id="NotificationsDiv"-->
<!--                                 class="dropdown-menu rounded-lg shadow border-0 dropdown-animation dropdown-menu-sm-end p-0 m-0">-->
<!--                                <div class="card border-0 w380">-->
<!--                                    <div class="card-header border-0 p-3">-->
<!--                                        <h5 class="mb-0 font-weight-light d-flex justify-content-between">-->
<!--                                            <span>Notifications</span>-->
<!--                                            <span class="badge text-white">06</span>-->
<!--                                        </h5>-->
<!--                                    </div>-->
<!--                                    <div class="tab-content card-body">-->
<!--                                        <div class="tab-pane fade show active">-->
<!--                                            <ul class="list-unstyled list mb-0">-->
<!--                                                <li class="py-2 mb-1 border-bottom">-->
<!--                                                    <a href="javascript:void(0);" class="d-flex">-->
<!--                                                        <img class="avatar rounded-circle"-->
<!--                                                             src="static/picture/avatar1.jpg" alt="">-->
<!--                                                        <div class="flex-fill ms-2">-->
<!--                                                            <p class="d-flex justify-content-between mb-0 "><span-->
<!--                                                                    class="font-weight-bold">Chloe Walkerr</span>-->
<!--                                                                <small>2MIN</small></p>-->
<!--                                                            <span class="">Added Appointment 2021-06-19 <span-->
<!--                                                                    class="badge bg-success">Book</span></span>-->
<!--                                                        </div>-->
<!--                                                    </a>-->
<!--                                                </li>-->
<!--                                                <li class="py-2 mb-1 border-bottom">-->
<!--                                                    <a href="javascript:void(0);" class="d-flex">-->
<!--                                                        <div class="avatar rounded-circle no-thumbnail">AH</div>-->
<!--                                                        <div class="flex-fill ms-2">-->
<!--                                                            <p class="d-flex justify-content-between mb-0 "><span-->
<!--                                                                    class="font-weight-bold">Alan	Hill</span> <small>13MIN</small>-->
<!--                                                            </p>-->
<!--                                                            <span class="">Lab sample collection</span>-->
<!--                                                        </div>-->
<!--                                                    </a>-->
<!--                                                </li>-->
<!--                                                <li class="py-2 mb-1 border-bottom">-->
<!--                                                    <a href="javascript:void(0);" class="d-flex">-->
<!--                                                        <img class="avatar rounded-circle"-->
<!--                                                             src="static/picture/avatar3.jpg" alt="">-->
<!--                                                        <div class="flex-fill ms-2">-->
<!--                                                            <p class="d-flex justify-content-between mb-0 "><span-->
<!--                                                                    class="font-weight-bold">Melanie	Oliver</span>-->
<!--                                                                <small>1HR</small></p>-->
<!--                                                            <span class="">Invoice Create Patient Room A-803</span>-->
<!--                                                        </div>-->
<!--                                                    </a>-->
<!--                                                </li>-->
<!--                                                <li class="py-2 mb-1 border-bottom">-->
<!--                                                    <a href="javascript:void(0);" class="d-flex">-->
<!--                                                        <img class="avatar rounded-circle"-->
<!--                                                             src="static/picture/avatar5.jpg" alt="">-->
<!--                                                        <div class="flex-fill ms-2">-->
<!--                                                            <p class="d-flex justify-content-between mb-0 "><span-->
<!--                                                                    class="font-weight-bold">Boris Hart</span> <small>13MIN</small>-->
<!--                                                            </p>-->
<!--                                                            <span class="">Medicine Order to Medical</span>-->
<!--                                                        </div>-->
<!--                                                    </a>-->
<!--                                                </li>-->
<!--                                                <li class="py-2 mb-1 border-bottom">-->
<!--                                                    <a href="javascript:void(0);" class="d-flex">-->
<!--                                                        <img class="avatar rounded-circle"-->
<!--                                                             src="static/picture/avatar6.jpg" alt="">-->
<!--                                                        <div class="flex-fill ms-2">-->
<!--                                                            <p class="d-flex justify-content-between mb-0 "><span-->
<!--                                                                    class="font-weight-bold">Alan	Lambert</span>-->
<!--                                                                <small>1HR</small></p>-->
<!--                                                            <span class="">Leave Apply</span>-->
<!--                                                        </div>-->
<!--                                                    </a>-->
<!--                                                </li>-->
<!--                                                <li class="py-2">-->
<!--                                                    <a href="javascript:void(0);" class="d-flex">-->
<!--                                                        <img class="avatar rounded-circle"-->
<!--                                                             src="static/picture/avatar7.jpg" alt="">-->
<!--                                                        <div class="flex-fill ms-2">-->
<!--                                                            <p class="d-flex justify-content-between mb-0 "><span-->
<!--                                                                    class="font-weight-bold">Zoe Wright</span> <small-->
<!--                                                                    class="">1DAY</small></p>-->
<!--                                                            <span class="">Patient Food Order Room A-809</span>-->
<!--                                                        </div>-->
<!--                                                    </a>-->
<!--                                                </li>-->
<!--                                            </ul>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <a class="card-footer text-center border-top-0" href="#"> View all notifications</a>-->
<!--                                </div>-->
<!--                            </div>-->

                        </div>
                        <div class="dropdown user-profile ml-2 ml-sm-3 d-flex align-items-center zindex-popover">
                            <div class="u-info me-2">
                                <p class="mb-0 text-end line-height-sm "><span
                                        class="font-weight-bold">John Quinn</span></p>
                                <small>Admin Profile</small>
                            </div>
                            <a class="nav-link dropdown-toggle pulse p-0" href="#" role="button"
                               data-bs-toggle="dropdown" data-bs-display="static">
                                <img class="avatar lg rounded-circle img-thumbnail" src="static/picture/profile_av.png"
                                     alt="profile">
                            </a>
                            <div class="dropdown-menu rounded-lg shadow border-0 dropdown-animation dropdown-menu-end p-0 m-0">
                                <div class="card border-0 w280">
                                    <div class="card-body pb-0">
                                        <div class="d-flex py-1">
                                            <img class="avatar rounded-circle" src="static/picture/profile_av.png"
                                                 alt="profile">
                                            <div class="flex-fill ms-3">
                                                <p class="mb-0"><span class="font-weight-bold">John	Quinn</span></p>
                                                <small class="">Johnquinn@gmail.com</small>
                                            </div>
                                        </div>

                                        <div>
                                            <hr class="dropdown-divider border-dark">
                                        </div>
                                    </div>
                                    <div class="list-group m-2 ">
<!--                                        <a href="virtual.html" class="list-group-item list-group-item-action border-0 "><i-->
<!--                                                class="icofont-ui-video-chat fs-5 me-3"></i>I-Health Virtual</a>-->
<!--                                        <a href="patient-invoices.html"-->
<!--                                           class="list-group-item list-group-item-action border-0 "><i-->
<!--                                                class="icofont-dollar fs-5 me-3"></i>Patient Invoices</a>-->
                                        <a href="javascript:;" class="list-group-item list-group-item-action border-0 "><i
                                                class="icofont-logout fs-6 me-3"></i>Signout</a>
                                        <div>
                                            <hr class="dropdown-divider border-dark">
                                        </div>
<!--                                        <a href="javascript:;" class="list-group-item list-group-item-action border-0 "><i-->
<!--                                                class="icofont-contact-add fs-5 me-3"></i>Add personal account</a>-->
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="setting ms-2">
                            <a href="#" data-bs-toggle="modal" data-bs-target="#Settingmodal"><i
                                    class="icofont-gear-alt fs-5"></i></a>
                        </div>
                    </div>

                    <!-- menu toggler -->
                    <button class="navbar-toggler p-0 border-0 menu-toggle order-3" type="button"
                            data-bs-toggle="collapse" data-bs-target="#mainHeader">
                        <span class="fa fa-bars"></span>
                    </button>

                    <!-- main menu Search-->
                    <div class="order-0 col-lg-4 col-md-4 col-sm-12 col-12 mb-3 mb-md-0 ">
<!--                        <div class="input-group flex-nowrap input-group-lg">-->
<!--                            <input type="search" class="form-control" placeholder="Search" aria-label="search"-->
<!--                                   aria-describedby="addon-wrapping">-->
<!--                            <button type="button" class="input-group-text" id="addon-wrapping"><i-->
<!--                                    class="fa fa-search"></i></button>-->

<!--                        </div>-->
                    </div>

                </div>
            </nav>
        </div>

        <!-- Body: Body -->
        <div class="body d-flex py-3">
            <div class="container-xxl">
                <div class="row align-items-center">
                    <div class="border-0 mb-4">
                        <div class="card-header py-3 no-bg bg-transparent d-flex align-items-center px-0 justify-content-between border-bottom flex-wrap">
                            <h3 class="fw-bold mb-0">添加原料信息</h3>
                        </div>
                    </div>
                </div> <!-- Row end  -->
                <div class="row mb-3">
                    <div class="col-sm-12" id="up-mat-info">
                        <div class="card mb-3" id="up-mat-encryinfo">
                            <div class="card-header py-3 d-flex justify-content-between bg-transparent border-bottom-0">
                                <h6 class="mb-0 fw-bold ">添加原料保密信息</h6>
                            </div>
                            <div class="card-body">
                                <form ref="form1">
                                    <div class="row g-3 align-items-center">
                                        <div class="col-md-6">
                                            <label for="material_id" class="form-label">原料编号</label>
                                            <input type="text" class="form-control" id="material_id"
                                                   v-model="material_id">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="savetime" class="form-label">上传时间</label>
                                            <input @click="saveetime" type="text" class="form-control" id="savetime"
                                                   v-model="savetime">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="materialprice" class="form-label">原料价格</label>
                                            <input type="text" class="form-control" id="materialprice"
                                                   v-model="materialprice">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="material_address" class="form-label">原料产地</label>
                                            <input type="text" class="form-control" id="material_address"
                                                   v-model="material_address">
                                        </div>


                                        <div class="col-md-6">
                                            <label for="material_tech" class="form-label">加工工艺</label>
                                            <input type="text" class="form-control" id="material_tech"
                                                   v-model="material_tech">
                                        </div>
                                        <div class="col-md-6">
                                            <label class="form-label">原料等级</label>
                                            <div class="row" id="material_grade">
                                                <div class="col-md-67">
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                               name="exampleRadios" id="exampleRadios11" value="一级"
                                                               checked="checked" @click="materialgrade"
                                                               v-model="material_grade">
                                                        <label class="form-check-label" for="exampleRadios11">
                                                            一级
                                                        </label>
                                                    </div>
                                                </div>
                                                <div class="col-md-67">
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                               name="exampleRadios" id="exampleRadios22"
                                                               value="二级" @click="materialgrade"
                                                               v-model="material_grade">
                                                        <label class="form-check-label" for="exampleRadios22">
                                                            二级
                                                        </label>
                                                    </div>
                                                </div>
                                                <div class="col-md-67">
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                               name="exampleRadios" id="exampleRadios33"
                                                               value="三级" @click="materialgrade"
                                                               v-model="material_grade">
                                                        <label class="form-check-label" for="exampleRadios33">
                                                            三级
                                                        </label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <label for="material_head" class="form-label">负责人</label>
                                            <input type="text" class="form-control" id="material_head"
                                                   v-model="material_head">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="material_phone" class="form-label">负责人电话</label>
                                            <input type="text" class="form-control" id="material_phone"
                                                   v-model="material_phone">
                                        </div>
                                        <div class="col-md-12">
                                            <label for="remark" class="form-label">备注</label>
                                            <textarea class="form-control" id="remark" rows="3"
                                                      v-model="remark"></textarea>
                                        </div>
                                    </div>


                                </form>
                                <button @click="postMatencryinfo" type="submit" class="btn btn-primary mt-4"
                                        id="uploasd">添加
                                </button>



                            </div>
                            <div class="card mb-3" id="upifo" v-show="showww">
                                <div class="card-header py-3 d-flex justify-content-between bg-transparent border-bottom-0">
                                    <h6 class="mb-0 fw-bold " v-bind:title="msgg">{{msgg}}</h6>
                                </div>
                                <div class="iddd" v-bind:title="idd">
                                    {{idd}}
                                </div>
                                <div class="card-body">

                                </div>
                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header py-3 d-flex justify-content-between bg-transparent border-bottom-0">
                                <h6 class="mb-0 fw-bold ">添加原料基本信息</h6>
                            </div>
                            <div class="card-body">
                                <form>
                                    <div class="row g-3 align-items-center">
                                        <div class="col-md-6">
                                            <label for="material_id2" class="form-label">原料编号</label>
                                            <input type="text" class="form-control" id="material_id2"
                                                   v-model="material_id2">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="material_name2" class="form-label">原料名称</label>
                                            <input type="text" class="form-control" id="material_name2"
                                                   v-model="material_name2">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="savetime2" class="form-label">上传时间</label>
                                            <input @click="saveetime2" type="text" class="form-control" id="savetime2"
                                                   v-model="savetime2">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="material_factory_id2" class="form-label">原料厂编号</label>
                                            <input type="text" class="form-control" id="material_factory_id2"
                                                   v-model="material_factory_id2">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="material_factory_name2" class="form-label">原料厂名称</label>
                                            <input type="text" class="form-control" id="material_factory_name2"
                                                   v-model="material_factory_name2">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="material_factory_address2" class="form-label">原料厂地址</label>
                                            <input type="text" class="form-control" id="material_factory_address2"
                                                   v-model="material_factory_address2">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="material_factory_phone2" class="form-label">原料厂电话</label>
                                            <input type="text" class="form-control" id="material_factory_phone2"
                                                   v-model="material_factory_phone2">
                                        </div>
                                        <div class="col-md-6">
                                            <label for="production_date2" class="form-label">生产日期</label>
                                            <input type="date" class="form-control" id="production_date2"
                                                   v-model="production_date2">
                                        </div>

                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label class="form-label">保密信息哈希值</label>
                                                <input type="text" class="form-control" id="hashID" v-model="hashID">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <label class="form-label">保密信息IPFSCID</label>
                                                <input type="text" class="form-control" id="encryptCID"
                                                       v-model="encryptCID">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <label for="remark" class="form-label">备注</label>
                                            <textarea class="form-control" id="remark2" rows="3"
                                                      v-model="remark2"></textarea>
                                        </div>

                                    </div>


                                </form>
                                <button @click="postMatipfsinfo" type="submit" class="btn btn-primary mt-4"
                                        id="upload1">添加
                                </button>
                            </div>
                        </div>
                        <div class="card mb-3" id="upinfo" v-show="showw">
                            <div class="card-header py-3 d-flex justify-content-between bg-transparent border-bottom-0">
                                <h6 class="mb-0 fw-bold " v-bind:title="msg">{{msg}}</h6>
                            </div>
                            <div class="iddd" v-bind:title="id">
                                {{id}}
                            </div>
                            <div class="card-body">

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Modal Custom Settings-->
        <div class="modal fade right" id="Settingmodal" tabindex="-1" aria-hidden="true">
            <div class="modal-dialog  modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Custom Settings</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body custom_setting">
                        <!-- Settings: Color -->
                        <div class="setting-theme pb-3">
                            <h6 class="card-title mb-2 fs-6 d-flex align-items-center"><i
                                    class="icofont-color-bucket fs-4 me-2 text-primary"></i>Template Color Settings</h6>
                            <ul class="list-unstyled row row-cols-3 g-2 choose-skin mb-2 mt-2">
                                <li data-theme="indigo">
                                    <div class="indigo"></div>
                                </li>
                                <li data-theme="tradewind" class="active">
                                    <div class="tradewind"></div>
                                </li>
                                <li data-theme="monalisa">
                                    <div class="monalisa"></div>
                                </li>
                                <li data-theme="blue">
                                    <div class="blue"></div>
                                </li>
                                <li data-theme="cyan">
                                    <div class="cyan"></div>
                                </li>
                                <li data-theme="green">
                                    <div class="green"></div>
                                </li>
                                <li data-theme="orange">
                                    <div class="orange"></div>
                                </li>
                                <li data-theme="blush">
                                    <div class="blush"></div>
                                </li>
                                <li data-theme="red">
                                    <div class="red"></div>
                                </li>
                            </ul>
                        </div>
                        <div class="sidebar-gradient py-3">
                            <h6 class="card-title mb-2 fs-6 d-flex align-items-center"><i
                                    class="icofont-paint fs-4 me-2 text-primary"></i>Sidebar Gradient</h6>
                            <div class="form-check form-switch gradient-switch pt-2 mb-2">
                                <input class="form-check-input" type="checkbox" id="CheckGradient">
                                <label class="form-check-label" for="CheckGradient">Enable Gradient! ( Sidebar )</label>
                            </div>
                        </div>
                        <!-- Settings: Template dynamics -->
                        <div class="dynamic-block py-3">
                            <ul class="list-unstyled choose-skin mb-2 mt-1">
                                <li data-theme="dynamic">
                                    <div class="dynamic"><i class="icofont-paint me-2"></i> Click to Dyanmic Setting
                                    </div>
                                </li>
                            </ul>
                            <div class="dt-setting">
                                <ul class="list-group list-unstyled mt-1">
                                    <li class="list-group-item d-flex justify-content-between align-items-center py-1 px-2">
                                        <label>Primary Color</label>
                                        <button id="primaryColorPicker"
                                                class="btn bg-primary avatar xs border-0 rounded-0"></button>
                                    </li>
                                    <li class="list-group-item d-flex justify-content-between align-items-center py-1 px-2">
                                        <label>Secondary Color</label>
                                        <button id="secondaryColorPicker"
                                                class="btn bg-secondary avatar xs border-0 rounded-0"></button>
                                    </li>
                                    <li class="list-group-item d-flex justify-content-between align-items-center py-1 px-2">
                                        <label class="text-muted">Chart Color 1</label>
                                        <button id="chartColorPicker1"
                                                class="btn chart-color1 avatar xs border-0 rounded-0"></button>
                                    </li>
                                    <li class="list-group-item d-flex justify-content-between align-items-center py-1 px-2">
                                        <label class="text-muted">Chart Color 2</label>
                                        <button id="chartColorPicker2"
                                                class="btn chart-color2 avatar xs border-0 rounded-0"></button>
                                    </li>
                                    <li class="list-group-item d-flex justify-content-between align-items-center py-1 px-2">
                                        <label class="text-muted">Chart Color 3</label>
                                        <button id="chartColorPicker3"
                                                class="btn chart-color3 avatar xs border-0 rounded-0"></button>
                                    </li>
                                    <li class="list-group-item d-flex justify-content-between align-items-center py-1 px-2">
                                        <label class="text-muted">Chart Color 4</label>
                                        <button id="chartColorPicker4"
                                                class="btn chart-color4 avatar xs border-0 rounded-0"></button>
                                    </li>
                                    <li class="list-group-item d-flex justify-content-between align-items-center py-1 px-2">
                                        <label class="text-muted">Chart Color 5</label>
                                        <button id="chartColorPicker5"
                                                class="btn chart-color5 avatar xs border-0 rounded-0"></button>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <!-- Settings: Font -->
                        <div class="setting-font py-3">
                            <h6 class="card-title mb-2 fs-6 d-flex align-items-center"><i
                                    class="icofont-font fs-4 me-2 text-primary"></i> Font Settings</h6>
                            <ul class="list-group font_setting mt-1">
                                <li class="list-group-item py-1 px-2">
                                    <div class="form-check mb-0">
                                        <input class="form-check-input" type="radio" name="font" id="font-poppins"
                                               value="font-poppins">
                                        <label class="form-check-label" for="font-poppins">
                                            Poppins Google Font
                                        </label>
                                    </div>
                                </li>
                                <li class="list-group-item py-1 px-2">
                                    <div class="form-check mb-0">
                                        <input class="form-check-input" type="radio" name="font" id="font-opensans"
                                               value="font-opensans" checked="">
                                        <label class="form-check-label" for="font-opensans">
                                            Open Sans Google Font
                                        </label>
                                    </div>
                                </li>
                                <li class="list-group-item py-1 px-2">
                                    <div class="form-check mb-0">
                                        <input class="form-check-input" type="radio" name="font" id="font-montserrat"
                                               value="font-montserrat">
                                        <label class="form-check-label" for="font-montserrat">
                                            Montserrat Google Font
                                        </label>
                                    </div>
                                </li>
                                <li class="list-group-item py-1 px-2">
                                    <div class="form-check mb-0">
                                        <input class="form-check-input" type="radio" name="font" id="font-mukta"
                                               value="font-mukta">
                                        <label class="form-check-label" for="font-mukta">
                                            Mukta Google Font
                                        </label>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <!-- Settings: Light/dark -->
                        <div class="setting-mode py-3">
                            <h6 class="card-title mb-2 fs-6 d-flex align-items-center"><i
                                    class="icofont-layout fs-4 me-2 text-primary"></i>Contrast Layout</h6>
                            <ul class="list-group list-unstyled mb-0 mt-1">
                                <li class="list-group-item d-flex align-items-center py-1 px-2">
                                    <div class="form-check form-switch theme-switch mb-0">
                                        <input class="form-check-input" type="checkbox" id="theme-switch">
                                        <label class="form-check-label" for="theme-switch">Enable Dark Mode!</label>
                                    </div>
                                </li>
                                <li class="list-group-item d-flex align-items-center py-1 px-2">
                                    <div class="form-check form-switch theme-high-contrast mb-0">
                                        <input class="form-check-input" type="checkbox" id="theme-high-contrast">
                                        <label class="form-check-label" for="theme-high-contrast">Enable High
                                            Contrast</label>
                                    </div>
                                </li>
                                <li class="list-group-item d-flex align-items-center py-1 px-2">
                                    <div class="form-check form-switch theme-rtl mb-0">
                                        <input class="form-check-input" type="checkbox" id="theme-rtl">
                                        <label class="form-check-label" for="theme-rtl">Enable RTL Mode!</label>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="modal-footer justify-content-start">
                        <button type="button" class="btn btn-white border lift" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary lift">Save Changes</button>
                    </div>
                </div>
            </div>
        </div>

    </div>

</div>

<!-- Jquery Core Js -->
<script src="static/js/libscripts.bundle.js"></script>

<style>
    .iddd {
        margin-left: 15px;
        margin-right: 15px;
    }
</style>
<!-- Jquery Page Js -->
<script src="static/js/template.js"></script>
<!--引入在线聊天-->

<script src="https://unpkg.com/vue@next"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>


<script type="text/javascript">

    const Upmatencryinfo = {
        data() {
            return {
                material_id: '',
                savetime: '',
                materialprice: '',
                material_address: '',
                material_tech: '',
                material_grade: '一级',
                material_head: '',
                material_phone: '',
                remark: '',

                material_id2: '',
                material_name2: '',
                savetime2: '',
                material_factory_id2: '',
                material_factory_name2: '',
                material_factory_address2: '',
                material_factory_phone2: '',
                production_date2: '',
                hashID: '',
                encryptCID: '',
                remark2: '',

                id: '', //基本信息 后面显示模块
                idd:'',  //保密信息，后面显示模块
                msg: '',  //基本信息，msg
                msgg:'',  //保密信息，msg

                showw:false,    //基本信息，组件显示   刚开始隐藏
                showww:false    //保密信息，组件显示
            }
        },
        methods: {

            saveetime() { //获取时间
                var _this = this;
                let yy = new Date().getFullYear();
                let mm = new Date().getMonth() + 1;
                let dd = new Date().getDate();
                let hh = new Date().getHours();
                let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes();
                let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds();
                _this.gettime = yy + '年' + mm + '月' + dd + '日 ' + hh + ':' + mf + ':' + ss;
                this.savetime = _this.gettime
                console.log(_this.gettime)
                // alert(_this.gettime)
            },
            saveetime2() {  //获取时间
                var _this = this;
                let yy = new Date().getFullYear();
                let mm = new Date().getMonth() + 1;
                let dd = new Date().getDate();
                let hh = new Date().getHours();
                let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes();
                let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds();
                _this.gettime = yy + '年' + mm + '月' + dd + '日 ' + hh + ':' + mf + ':' + ss;
                this.savetime2 = _this.gettime
                console.log(_this.gettime)

            },
            materialgrade(event) {
                this.material_grade = event.target.value
            },
            async postMatencryinfo() {
                var matencryptdata = {
                    material_id: this.material_id,
                    savetime: this.savetime,
                    materialprice: this.materialprice,
                    material_address: this.material_address,
                    material_tech: this.material_tech,
                    material_grade: this.material_grade,
                    material_head: this.material_head,
                    material_phone: this.material_phone,
                    remark: this.remark
                }

                await axios.post('http://localhost:9000/api/mat/upmatencryinfo', matencryptdata)
                    .then((response) => {
                        this.showww=true    //显示组件
                        this.idd = response.data.data
                        this.msgg = response.data.msg
                        this.hashID = response.data.data.hashID    //传值
                        this.encryptCID = response.data.data.encryptCID
                        console.log(response.data);
                      //alert(response.data.msg)
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
                this.material_id2 = this.material_id    //id传给下面
            },
            async postMatipfsinfo() {
                var matipfsdata = {
                    material_id: this.material_id2,
                    material_name: this.material_name2,
                    savetime: this.savetime2,
                    material_factory_id: this.material_factory_id2,
                    material_factory_name: this.material_factory_name2,
                    material_factory_address: this.material_factory_address2,
                    material_factory_phone: this.material_factory_phone2,
                    production_date: this.production_date2,
                    hashID: this.hashID,
                    encryptCID: this.encryptCID,
                    remark: this.remark2
                }
                await axios.post('http://localhost:9000/api/mat/upmatinfo', matipfsdata)
                    .then((response) => {
                        this.showw=true    //显示组件
                        this.msg = response.data.msg
                        this.id = response.data.data
                        console.log(response.data)
                        // alert(response.data.msg)
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            }
        }
    }
    Vue.createApp(Upmatencryinfo).mount('#up-mat-info')

</script>
</body>
</html>